<template>
	<view class="content">

		<view id="top" style="padding: 0 30upx;padding-top: 180rpx">
<!-- 			<view class="title" :style="{paddingTop: marginTop+'px'}">
				<image src="../../static/logo.png" mode=""></image>
				<text>玩聚联盟 团建界的Keep</text>
			</view> -->
			<view class="" style="padding-bottom: 12upx;display: flex;align-items: center;">
				<u-search placeholder="请输入搜索内容" v-model="keyword" disabled :showAction="false" @click="focus">
				</u-search>
				<view class="care" @click="navCreateActivity">
					已购挑战
				</view>
			</view>
		</view>



		<goodsVideoList :goodsList="goodsList"
			:scrollHeight="`calc(100vh - ${domHeight}px)`" marginNum="20rpx 30rpx 40rpx 30rpx" bannerShow
			titleText="推荐挑战" />

		<u-popup :show="coupShow" mode="center" :safeAreaInsetBottom="false" closeable round="12rpx"
			@close="coupShow=false">
			<view style="padding: 0 50upx;width: calc(100vw - 200upx);">
				<view class=""
					style="font-size: 36upx;color: #333333;text-align: center;font-weight: 700;margin: 110upx auto;">
					优惠券领取成功
				</view>
				<view class="" style="display: flex;justify-content: space-between;margin-bottom: 30upx;">
					<view class="anew_btn" @click="coupGo">
						去查看
					</view>
					<view class="anew_btn" @click="coupShow=false">
						我知道了
					</view>
				</view>
			</view>
		</u-popup>
		<Loading />
		
		<view class="shopping-cart" @click="goShopping">
			<u-icon name="shopping-cart" color="#ffffff" size="48rpx"></u-icon>
			<view style="margin-top: 10rpx;">
				购物车
			</view>
		</view>
	</view>
</template>

<script>
	import goodsVideoList from '@/components/goodsVideoList/goodsVideoList.vue'

	export default {
		components: {
			goodsVideoList
		},
		data() {
			return {
				marginTop: 0,
				domHeight: 0,
				goodsList: [],
				textList: [],
				coupShow: false,
				shareId: null,

			}
		},
		onLoad(e) {
			console.log('????',e)
			if (e.shareId) this.shareId = e.shareId
			this.marginTop = uni.getMenuButtonBoundingClientRect().top
			this.$myRuquest('home/index/news_list', {
				isin: 1
			}).then(res => {
				res.data.forEach(item => {
					item.type = 2
				})
				this.textList = res.data
			})


		},
		onShow() {
			if (this.shareId) {
				this.$myRuquest('home/user/coupons_save', {
					coup_id: this.shareId
				}).then(res => {
					this.coupShow = true

				})
				this.shareId = null
			}
			if (this.$ws) this.$ws.completeClose()
			uni.removeStorageSync('gameId');
		},
		mounted() {
			const query = uni.createSelectorQuery().in(this);
			query.select('#top').boundingClientRect(data => {
				console.log(data)
				this.domHeight = data.height
			}).exec();
			this.upData()
		},
		onShareAppMessage() {},
		methods: {
			goShopping(){
				uni.navigateTo({
					url: '/pages/trolley/trolley'
				})
			},
			coupGo() {
				this.coupShow = false
				uni.navigateTo({
					url: '/pages/me/myCoupon/myCoupon'
				})
			},
			navCreateActivity() {
				uni.navigateTo({
					url: '/pages/createActivity/createActivity'
				})
			},
			upData() {


				let data = {
					status: 1
				}
				this.$myRuquest('home/index/activity_list', data).then(res => {
					let list = res.data.list
					list.push(...this.textList)
					list.sort(function() {
						return Math.random() - 0.5
					})
					this.goodsList = list



				})
			},
			// scrolltolower() {
			// 	this.upData()
			// },
			focus() {
				uni.navigateTo({
					url: `/pages/searchGoods/searchGoods`
				})
			},

		}
	}
</script>

<style lang="scss" scoped>
	.care {
		color: #333;
		font-size: 28upx;
		margin-left: 20upx;
	}
	.shopping-cart{
		position: fixed;
		right: 20upx;
		bottom:160upx;
		z-index: 1999;
		text-align: center;
		font-size: 24upx;
		border-radius: 15upx;
		background-color: rgba(0, 0, 0, .7);
		color: #fff;
		width: 90upx;
		height: 90upx;
		padding: 10upx;
	}

	.content {


		.title {
			display: flex;
			margin-bottom: 40upx;
			align-items: center;
			font-size: 28upx;
			color: #333333;
			font-weight: 700;

			image {
				width: 54upx;
				height: 46upx;
				margin-right: 4upx;
			}
		}


	}

	.anew_btn {
		width: 234upx;
		height: 68upx;
		line-height: 68upx;
		border-radius: 34upx;
		text-align: center;
		background-color: #FED194;
		color: #AC7D3D;
		font-size: 28upx;
	}
</style>
